import QtQuick 2.12
import QtQuick.Layouts 1.12
import QtQuick.Controls 2.12

Rectangle {
    color: "transparent"

    ColumnLayout {
        anchors.fill: parent
        spacing: 20

        // 页面标题
        Label {
            text: "操作首页"
            font.pixelSize: 28
            font.bold: true
            color: "#2c3e50"
            Layout.alignment: Qt.AlignHCenter
        }

        // 欢迎信息
        Rectangle {
            color: "#f8f9fa"
            radius: 8
            Layout.fillWidth: true
            Layout.preferredHeight: 100

            ColumnLayout {
                anchors.centerIn: parent
                spacing: 10

                Label {
                    text: "欢迎使用甘蔗农机智能管控平台"
                    font.pixelSize: 18
                    color: "#2c3e50"
                    Layout.alignment: Qt.AlignHCenter
                }
            }
        }

        // 功能卡片区域
        GridLayout {
            columns: 2
            Layout.fillWidth: true
            Layout.fillHeight: true
            rowSpacing: 20
            columnSpacing: 20

            // 快速操作卡片
            Rectangle {
                color: "white"
                radius: 8
                Layout.fillWidth: true
                Layout.fillHeight: true
                border.color: "#e9ecef"
                border.width: 1

                ColumnLayout {
                    anchors.fill: parent
                    anchors.margins: 20
                    spacing: 15

                    Label {
                        text: "🚀 快速操作"
                        font.pixelSize: 16
                        font.bold: true
                        color: "#2c3e50"
                    }

                    Button {
                        text: "启动机器人"
                        background: Rectangle {
                            color: "#27ae60"
                            radius: 6
                        }
                        contentItem: Text {
                            text: "启动机器人"
                            color: "white"
                            horizontalAlignment: Text.AlignHCenter
                        }
                        Layout.fillWidth: true
                        Layout.preferredHeight: 40
                    }

                    Button {
                        text: "停止机器人"
                        background: Rectangle {
                            color: "#e74c3c"
                            radius: 6
                        }
                        contentItem: Text {
                            text: "停止机器人"
                            color: "white"
                            horizontalAlignment: Text.AlignHCenter
                        }
                        Layout.fillWidth: true
                        Layout.preferredHeight: 40
                    }
                }
            }

            // 系统状态卡片
            Rectangle {
                color: "white"
                radius: 8
                Layout.fillWidth: true
                Layout.fillHeight: true
                border.color: "#e9ecef"
                border.width: 1

                ColumnLayout {
                    anchors.fill: parent
                    anchors.margins: 20
                    spacing: 15

                    Label {
                        text: "📊 系统状态"
                        font.pixelSize: 16
                        font.bold: true
                        color: "#2c3e50"
                    }

                    RowLayout {
                        Layout.fillWidth: true
                        spacing: 20

                        ColumnLayout {
                            spacing: 5

                            Label {
                                text: "在线机器人"
                                font.pixelSize: 12
                                color: "#7f8c8d"
                            }

                            Label {
                                text: "2"
                                font.pixelSize: 24
                                font.bold: true
                                color: "#27ae60"
                            }
                        }

                        ColumnLayout {
                            spacing: 5

                            Label {
                                text: "运行任务"
                                font.pixelSize: 12
                                color: "#7f8c8d"
                            }

                            Label {
                                text: "0"
                                font.pixelSize: 24
                                font.bold: true
                                color: "#3498db"
                            }
                        }
                    }
                }
            }

            // 最近活动卡片
            Rectangle {
                color: "white"
                radius: 8
                Layout.fillWidth: true
                Layout.fillHeight: true
                border.color: "#e9ecef"
                border.width: 1

                ColumnLayout {
                    anchors.fill: parent
                    anchors.margins: 20
                    spacing: 15

                    Label {
                        text: "📋 最近活动"
                        font.pixelSize: 16
                        font.bold: true
                        color: "#2c3e50"
                    }

                    ListView {
                        Layout.fillWidth: true
                        Layout.fillHeight: true
                        model: [
                            "机器人 GZJY001 已连接",
                            "系统自检完成",
                            "传感器校准成功",
                            "任务队列已清空"
                        ]

                        delegate: Rectangle {
                            width: parent.width
                            height: 30
                            color: "transparent"

                            RowLayout {
                                anchors.fill: parent
                                spacing: 10

                                Rectangle {
                                    width: 6
                                    height: 6
                                    radius: 3
                                    color: "#27ae60"
                                }

                                Label {
                                    text: modelData
                                    font.pixelSize: 12
                                    color: "#2c3e50"
                                    Layout.fillWidth: true
                                }
                            }
                        }
                    }
                }
            }

            // 环境信息卡片
            Rectangle {
                color: "white"
                radius: 8
                Layout.fillWidth: true
                Layout.fillHeight: true
                border.color: "#e9ecef"
                border.width: 1

                ColumnLayout {
                    anchors.fill: parent
                    anchors.margins: 20
                    spacing: 15

                    Label {
                        text: "🌡️ 环境信息"
                        font.pixelSize: 16
                        font.bold: true
                        color: "#2c3e50"
                    }

                    ColumnLayout {
                        spacing: 10
                        Layout.fillWidth: true

                        RowLayout {
                        Layout.fillWidth: true

                        Label {
                            text: "温度："
                            font.pixelSize: 12
                            color: "#7f8c8d"
                        }

                        Label {
                            text: mainWindow.currentRobotData && mainWindow.currentRobotData.temperature !== undefined ? mainWindow.currentRobotData.temperature + "℃" : "25℃"
                            font.pixelSize: 14
                            font.bold: true
                            color: mainWindow.currentRobotData && mainWindow.currentRobotData.temperature > 60 ? "#e74c3c" : "#2c3e50"
                            Layout.fillWidth: true
                        }
                    }

                        RowLayout {
                            Layout.fillWidth: true

                            Label {
                                text: "湿度："
                                font.pixelSize: 12
                                color: "#7f8c8d"
                            }

                            Label {
                                text: "50%RH"
                                font.pixelSize: 14
                                font.bold: true
                                color: "#2c3e50"
                                Layout.fillWidth: true
                            }
                        }

                        RowLayout {
                            Layout.fillWidth: true

                            Label {
                                text: "天气："
                                font.pixelSize: 12
                                color: "#7f8c8d"
                            }

                            Label {
                                text: "晴"
                                font.pixelSize: 14
                                font.bold: true
                                color: "#2c3e50"
                                Layout.fillWidth: true
                            }
                        }
                    }
                }
            }
        }
    }
}
